<article class="module-account module-account-lockreward">
    <div class="ui-account-box">
        <h3 class="ui-title-account">{{$t('lockReward.lockReward')}}</h3>
        <div class="box-content">
            <div class="table-wrap">
                <div class="m-table">
                    <table>
                        <thead>
                        <tr>
                            <th width="25%">{{ $t('lockReward.month') }}</th>
                            <th width="25%">{{ $t('lockReward.accountName')}}</th>
                            <th class="fn-ta-right" width="25%">{{ $t('lockReward.lockSum')}}</th>
                            <th class="fn-ta-right" width="25%">{{ $t('lockReward.reward')}}</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in lockRewardList" v-if="isLockRewardListLoading === false && lockRewardList.length > 0">
                            <td>{{item.rewardYear}}-{{item.rewardMonth}}</td>
                            <td>{{item.email}}</td>
                            <td class="fn-ta-right">{{filter.floorFix(item.lockAmount, precision)}}{{item.assetCode}}</td>
                            <td class="fn-ta-right">{{filter.floorFix(item.rewardAmount, precision)}}{{item.assetCode}}</td>
                        </tr>
                        </tbody>
                    </table>
                    <loading v-if="isLockRewardListLoading"></loading>
                    <no-data v-if="isLockRewardListLoading === false && lockRewardList && lockRewardList.length === 0"></no-data>
                </div>
                <pager :page-no="condition.pageNo"
                       :page-size="condition.pageSize"
                       :on-page-change="changePage"
                       :page-num="condition.pageNum"></pager>
            </div>
        </div>
    </div>
</article>